<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <!-- 	<meta name="format-detection" content="telephone=no"> -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <script type="text/javascript">
        //手机适配
        var cssEl = document.createElement("style");
        document.documentElement.firstElementChild.appendChild(cssEl);
        function setPxPerRem() {
            var dpr = 1;
            var pxPerRem = document.documentElement.clientWidth * dpr / 10;
            if (pxPerRem > 60) {
                pxPerRem = 60;
            }
            cssEl.innerHTML = 'html{font-size:' + pxPerRem + 'px!important;}';
        }
        setPxPerRem();
        //手机适配结束
    </script>
    <link rel="stylesheet" type="text/css" href="css/swiper-3.3.1.min.css">
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<header class="top-d">
    <h1><img src="images/home/logo.jpg"></h1>
    <a href="javascript:void(0);" class="h-list-btn"></a>
</header>
<section class="nav-list">
    <a href="course.html">课程</a>
    <a href="android.html">专业快讯</a>
    <a href="teach-jxcg.html">教学科研</a>
    <a href="">毕业生</a>
    <a href="">产教融合</a>
</section>
<section class="h-banner swiper-container3 swiper-container">
    <ul class="swiper-wrapper">
        <li class="swiper-slide"><a href=""><img src="images/home/banner.jpg" width="100%"></a></li>
        <li class="swiper-slide"><a href=""><img src="images/home/banner.jpg" width="100%"></a></li>
        <li class="swiper-slide"><a href=""><img src="images/home/banner.jpg" width="100%"></a></li>
    </ul>
    <div class="swiper-pagination"></div>
</section>

<!--专业快讯-->
<section class="today-head">
    <div class="today-lt">
        <span>专业</span>
        <span>快讯</span>
    </div>
    <div class="swiper-container1">
        <ul>
            <li class=""><a href="">人机围棋大战再临！AlphaGo或下月来华挑战柯洁</a></li>
            <li class=""><a href="">医闹何时休?VR技术的诞生可不可以缓和医患矛盾?</a></li>
            <li class=""><a href="">为什么机器编辑会毁掉自媒体</a></li>
            <li class=""><a href="">迪士尼也玩全息投影，将申请AR投影新专利</a></li>
        </ul>
    </div>
</section>

<!-- 图标导航 -->
<section class="h-nav">

    <a href="">
        <img src="images/home/h-vrschool@2x.png">
        <p>VR全景看校园</p>
    </a><a href="">
    <img src="images/home/h-vrmajor@2x.png">
    <p>VR全景看专业</p>
</a><a href="">
    <img src="images/home/h-special@2x.png">
    <p>专业特色</p>
</a><a href="">
    <img src="images/home/h-lecture@2x.png">
    <p>专业讲座</p>
</a><a href="">
    <img src="images/home/h-minternet@2x.png">
    <p>移动互联网</p>
</a><a href="">
    <img src="images/home/h-arvr@2x.png">
    <p>数字交互</p>
</a><a href="">
    <img src="images/home/h-web@2x.png">
    <p>WEB前端/后端</p>
</a><a href="">
    <img src="images/home/h-bigdata@2x.png">
    <p>大数据应用</p>
</a>
</section>
<!-- 图标导航结束-->

<!--师资-->
<section class="section2 swiper-container2 swiper-container">
    <ul class="swiper-wrapper">
        <li class="swiper-slide">
            <img src="images/android/t_hcb.jpg">
            <h4>黄崇本 教授 浙江省教学名师</h4>
            <p>黄崇本教授兼任中国职业教育学会计算机专业委员会委员，浙江省高职高专计算机类专业教学指导委员会委员，宁波市计算机学会常务理事，宁波市软件行业协会理事。</p>
        </li>
        <li class="swiper-slide">
            <img src="images/android/t_wcc.jpg">
            <h4>韦存存 副教授</h4>
            <p>教育部留学基金委访问学者资助对象、浙江省高校优秀青年教师资助对象；宁波市领军和拔尖人才工程第三层次培养对象；软件技术专业教师，担任Web应用程序开发、数据库技术与应用等课程的教学工作，主要研究方向有智能语义、数据挖掘、定位导航技术等。</p>
        </li>
        <li class="swiper-slide">
            <img src="images/android/t_gqq.jpg">
            <h4>葛茜倩 副教授</h4>
            <p>软件技术专业教师，担任程序设计实践、数据库技术与应用等课程的教学工作。主要研究方向有嵌入式系统应用开发、信息技术等。</p>
        </li>
        <li class="swiper-slide">
            <img src="images/android/t_xc.jpg">
            <h4>徐畅 副教授 博士</h4>
            <p>软件技术专业教师，担任移动应用开发、数据库技术与应用等课程的教学工作，主要研究方向有机器视觉、红外成像、信息技术等。</p>
        </li>
        <li class="swiper-slide">
            <img src="images/android/t_ths.jpg">
            <h4>谭恒松 讲师</h4>
            <p>软件技术专业教师，2002年开始从事计算机技术教育，主要研究方向软件开发、数据库技术、虚拟现实技术等。从事教育十多年，公开发表多篇论文，主编教材5部，参与社会多项大型项目，有企业工作经验。</p>
        </li>
        <li class="swiper-slide">
            <img src="images/android/t_yld.jpg">
            <h4>严良达 讲师</h4>
            <p>软件技术专业教师，主要研究方向有数据挖掘，软件工程，智能图像处理，数据库技术等。主持参与多项省、市级教科研项目，带领学生参加各类科技竞赛成绩优秀。</p>
        </li>
    </ul>
    <div class="swiper-button-prev"></div>
    <div class="swiper-button-next"></div>
    <div class="swiper-pagination"></div>

</section>
<!--师资结束-->
<!--创新联盟-->
<section class="h-cxlm">
    <h3>创新联盟</h3>
    <ul class="clear">
        <li>
            <img src="images/home/banner.jpg" alt="">
            <p>创新联盟</p>
        </li>
        <li>
            <img src="images/home/banner.jpg" alt="">
            <p>创新联盟</p>
        </li>
        <li>
            <img src="images/home/banner.jpg" alt="">
            <p>创新联盟</p>
        </li>
        <li>
            <img src="images/home/banner.jpg" alt="">
            <p>创新联盟</p>
        </li>
    </ul>
</section>
<!--创新联盟结束-->
<!--优秀毕业生-->
<section class="h-yxbys">
    <h3>优秀毕业生</h3>
    <div class="h-scr" id="picScroll">
        <ul class="clear" id="picUl">
            <li>
                <a href=""><img src="images/home/banner.jpg" alt=""></a>
            </li>
            <li>
                <a href=""><img src="images/home/banner.jpg" alt=""></a>
            </li>
            <li>
                <a href=""><img src="images/home/banner.jpg" alt=""></a>
            </li>
            <li>
                <a href=""><img src="images/home/banner.jpg" alt=""></a>
            </li>
            <li>
                <a href=""><img src="images/home/banner.jpg" alt=""></a>
            </li>
            <li>
                <a href=""><img src="images/home/banner.jpg" alt=""></a>
            </li>
        </ul>
    </div>
</section>

<!--bot start-->
<section class="bot">
    <!--		<div class="bot-top"><a href="">首页</a><a href="">专业</a><a href="">创新联盟</a><a href="">师资队伍</a><a href="">创新创业</a></div>
            <!--<div class="h-choice">
                <a href="http://www.yztcedu.com/">电脑版</a><span>|</span><a href="">触屏版</a>
            </div>-->
</section>
<!--bot end-->
<!-- 固定导航 -->
<footer class="base-nav">
    <ul>
        <li>
            <a href="index.html">首页</a>
        </li>
        <li>
            <a href="major.html">专业</a>
        </li>

        <li>
            <a href="">创新联盟</a>
        </li>
        <li>
            <a href="teacher.html">师资队伍</a>
        </li>
        <li>
            <a href="">创新创业</a>
        </li>
    </ul>
</footer>


	<script type="text/javascript" src="js/jquery-2.2.3.min.js"></script>
	<script type="text/javascript" src="js/swiper-3.3.1.jquery.min.js"></script>
	<!--头条滚动-->
	<script type="text/javascript">
		var iH=$(".swiper-container1 li").height();
		var timer=null;

    $(".swiper-container1 ul").timer = setInterval(function () {

        $(".swiper-container1 ul").animate({"top": -iH}, 600, function () {
            $(".swiper-container1 ul").find("li").first().appendTo($(".swiper-container1 ul"));
            $(".swiper-container1 ul").css("top", 0);
        });

    }, 2000);

</script>


<!--返回顶部-->
<script type="text/javascript">
    $(".h-backTop").on("click", function () {
        $("html,body").stop().animate({scrollTop: 0}, 800, "easeInOutQuint");
    });
</script>

<!--导航显示隐藏-->
<script type="text/javascript">

    function cssTransform(el, attr, val) {
        if (!el.transform) {
            el.transform = {};
        }
        if (arguments.length > 2) {
            el.transform[attr] = val;
            var sVal = "";
            for (var s in el.transform) {
                switch (s) {
                    case "rotate":
                    case "skewX":
                    case "skewY":
                        sVal += s + "(" + el.transform[s] + "deg) ";
                        break;
                    case "translateX":
                    case "translateY":
                        sVal += s + "(" + el.transform[s] + "px) ";
                        break;
                    case "scaleX":
                    case "scaleY":
                    case "scale":
                        sVal += s + "(" + el.transform[s] + ") ";
                        break;
                }
                el.style.WebkitTransform = el.style.transform = sVal;
            }
        } else {
            val = el.transform[attr];
            if (typeof val == "undefined") {
                if (attr == "scale" || attr == "scaleX" || attr == "scaleY") {
                    val = 1;
                } else {
                    val = 0;
                }
            }
            return val;
        }
    }


    $(".h-list-btn").on("click", function () {
        $(".nav-list").slideToggle();
    });

    jQuery.extend(jQuery.easing, {
        easeInOutQuint: function (x, t, b, c, d) {
            if ((t /= d / 2) < 1) return c / 2 * t * t * t * t * t + b;
            return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
        }
    });

    var mySwiper = new Swiper('.swiper-container3', {
        autoplay: 5000,//可选选项，自动滑动
        loop: true,
        pagination: '.swiper-pagination',
        initialSlide: 0,
        autoplayDisableOnInteraction: false
    })   //轮播图

    //师资
    var mySwiper2 = new Swiper('.swiper-container2', {
        /*autoplay: 5000,*///可选选项，自动滑动
        loop: true,
        pagination: '.swiper-pagination',
        initialSlide: 0,
        autoplayDisableOnInteraction: false,
        prevButton: '.swiper-button-prev',
        nextButton: '.swiper-button-next'
    })   //轮播图

    /*毕业生*/
    navSwipe();
    function navSwipe() {
        var navScroll = document.querySelector('#picScroll');
        var navs = document.querySelector('#picUl');
        $("#picUl").width($("#picUl").find("li").length * $("#picUl").find("li").first().outerWidth(true));
        var startPoint = 0;
        var startX = 0;
        var minX = navScroll.clientWidth - navs.offsetWidth;
        console.log(navs.offsetWidth);
        var step = 1;

        navScroll.addEventListener(
            'touchstart',
            function (e) {
                startPoint = e.changedTouches[0].pageX;
                startX = cssTransform(navs, "translateX");
                step = 1;
            }
        );
        navScroll.addEventListener(
            'touchmove',
            function (e) {
                var nowPoint = e.changedTouches[0].pageX;
                var dis = nowPoint - startPoint;
                var left = startX + dis;

                if (left > 0) {
                    step = 1 - left / navScroll.clientWidth; //根据超出长度计算系数大小，超出的越到 系数越小
                    //left = parseInt(left*step);
                    left = 0;
                }
                if (left < minX) {
                    var over = minX - left; // 计算下超出值
                    step = 1 - over / navScroll.clientWidth; //根据超出值计算系数
                    over = parseInt(over * step);
                    left = minX - over;
                    left = minX;
                }
                cssTransform(navs, "translateX", left);
                e.preventDefault();
            }
        );
    }

</script>
</body>
</html>